import React, { Component } from 'react'
import Header from '../Header/Header'
import Index from '../page/Data/index'
import Tags from '../page/Tags/index'
import Introduction from '../page/Introduction/index'
import Message from '../page/Message/index'
import Content from '../page/Content/index'
import Search from '../page/Search/index'
import View404 from '../page/View404/index'
import Sidebar from '../page/Sidebar/index'
import { Route ,Redirect,NavLink,Switch} from 'react-router-dom'
import './index.scss'

import {BrowserRouter as Router} from 'react-router-dom'

export default class App extends Component {
    constructor(props){
        super(props)
    }
    render() {
        return (           
            <div style={{backgroundImage:'url(../background.jpg)',backgroundSize:'cover',backgroundRepeat:'no-repeat',backgroundPosition:'center'}}>
                <Header></Header>
                <div className="details">
                    <div className="details-left">
                        <Switch>
                            <Route path = "/index" component={Index} />
                            <Redirect from='/' exact to='/index/1'></Redirect>
                            <Route path = "/tags" exact component={Tags} />
                            <Route path = "/introduction" exact component={Introduction} />
                            <Route path = "/message" exact component={Message} />
                            <Route path = "/content" component={Content} />
                            <Route path = "/search" component={Search} />
                            <Route component={View404} />
                        </Switch>
                    </div>
                    <div className="details-right">
                        <Sidebar/>
                    </div>
                </div>
            </div>
        )
    }
}
